﻿<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title></title>
  <script type="text/javascript" src="js/jquery.js"></script>
  <script type="text/javascript" src="js/echarts.min.js"></script>
  <script type="text/javascript" src="js/js.js"></script>
  <script type="text/javascript" src="js/jquery.limarquee.js"></script>
  <script type="text/javascript" src="js/jquery.cxselect.min.js"></script>

  <link rel="stylesheet" href="css/comon0.css">
</head>

<body>
  <div style="background:#000d4a url(images/bg.jpg) center top;">
    <div class="loading">
      <div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
    </div>
    <div class="back"></div>
    <div class="head">
      <div class="weather"><span id="showTime"></span></div>
      <h1><a href="https://gitee.com/iGaoWei/big-data-view" style="color: white">通用大数据可视化展示平台模板</a></h1>

    </div>
    <script>
      var t = null;
      t = setTimeout(time, 1000);//開始运行
      function time() {
        clearTimeout(t);//清除定时器
        dt = new Date();
        var y = dt.getFullYear();
        var mt = dt.getMonth() + 1;
        var day = dt.getDate();
        var h = dt.getHours();//获取时
        var m = dt.getMinutes();//获取分
        var s = dt.getSeconds();//获取秒
        document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "日" + h + "时" + m + "分" + s + "秒";
        t = setTimeout(time, 1000); //设定定时器，循环运行     
      }

    </script>
    <div class="mainbox">
      <ul class="clearfix">
        <li>
          <div class="boxall" style="height:400px;">
            <div class="alltitle">各小组计划完成度</div>
            <div class="navboxall" id="echart5"></div>
          </div>
          <div class="boxall" style="height:260px;">
            <div class="alltitle">标题样式2</div>
            <div class="navboxall">
              <div class="wraptit">
                <span>单号</span><span>金额</span><span>品名</span><span>时间</span>
              </div>
              <div class="wrap">
                <ul>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>
                  <li>
                    <p><span>100021415</span><span>199</span><span>手机</span><span>18小时</span></p>
                  </li>

                </ul>
              </div>

            </div>
          </div>
          <div class="boxall" style="height:260px;">
            <div class="alltitle">标题样式3</div>

            <div class="navboxall" id="echart1"></div>
          </div>
          <div class="boxall" style="height:345px;">
            <div class="alltitle">标题样式4</div>

            <div class="navboxall" id="echart6"></div>
          </div>
        </li>
        <li>

          <div class="boxall" style="height:230px">
            <div class="clearfix navboxall" style="height: 100%">
              <div class="pulll_left num">
                <div class="numbt">总体情况<span>(单位：元)</span></div>
                <div class="numtxt">520131400 </div>
              </div>
              <div class="pulll_right zhibiao">
                <div class="zb1"><span>标题样式5</span>
                  <div id="zb1"></div>
                </div>
                <div class="zb2"><span>标题样式6</span>
                  <div id="zb2"></div>
                </div>
                <div class="zb3"><span>标题样式7</span>
                  <div id="zb3"></div>
                </div>
              </div>
            </div>
          </div>
          <div class="boxall" style="height:350px">
            <div style="display: flex; justify-content: space-between; align-items: center;">
              <div class="alltitle">标题样式8</div>
              <div>
                <div class="btn btn_act" onclick="videoChange(1)">1x1</div>
                <div class="btn" onclick="videoChange(2)">2x2</div>
                <div class="btn" onclick="videoChange(3)">3x3</div>
                <div class="btn" onclick="videoChange(4)">4x4</div>
              </div>
            </div>
            <div id="video">
              <video width="100%" height="288" controls
                src="http://pai-1-app.yihaopingji.com/0e9e0195723ecec537e3d4b8309de2a5.mp4"></video>
            </div>
          </div>
          <div class="boxall" style="height:340px">
            <div class="alltitle">销售利润趋势图</div>
            <div class="navboxall" id="echart3"></div>
          </div>
          <div class="boxall" style="height:344px">
            <div class="alltitle">标题样式10</div>
            <div class="navboxall" id="echart4"></div>
          </div>
        </li>
        <li>
          <div class="boxall" style="height:300px">
            <div class="alltitle">标题样式11</div>
            <div class="navboxall">
              <table class="table1" width="100%" border="0" cellspacing="0" cellpadding="0">
                <tbody>
                  <tr>
                    <th scope="col">排名</th>
                    <th scope="col">公司</th>
                    <th scope="col">数量</th>
                    <th scope="col">增长率</th>
                  </tr>
                  <tr>
                    <td><span>1</span></td>
                    <td>腾讯科技</td>
                    <td>114万<br></td>
                    <td>100%<br></td>
                  </tr>
                  <tr>
                    <td><span>2</span></td>
                    <td>百度公司</td>
                    <td>923823万</td>
                    <td>21%</td>
                  </tr>

                  <tr>
                    <td><span>3</span></td>
                    <td>新浪</td>
                    <td>1240253万</td>
                    <td>12%</td>
                  </tr>
                  <tr>
                    <td><span>4</span></td>
                    <td>网易</td>
                    <td>1.2亿</td>
                    <td>39%</td>
                  </tr>
                  <tr>
                    <td><span>5</span></td>
                    <td>雅虎</td>
                    <td>13423万</td>
                    <td>9%</td>
                  </tr>

                </tbody>
              </table>
            </div>
          </div>

          <div class="boxall" style="height: 300px">
            <div class="alltitle">标题样式</div>
            <div class="navboxall">
              <table class="table1" width="100%" border="0" cellspacing="0" cellpadding="0">
                <tbody>
                  <tr>
                    <th scope="col">排名</th>
                    <th scope="col">公司</th>
                    <th scope="col">数量</th>
                    <th scope="col">增长率</th>
                  </tr>
                  <tr>
                    <td><span>1</span></td>
                    <td>腾讯科技</td>
                    <td>114万<br></td>
                    <td>100%<br></td>
                  </tr>
                  <tr>
                    <td><span>2</span></td>
                    <td>百度公司</td>
                    <td>923823万</td>
                    <td>21%</td>
                  </tr>

                  <tr>
                    <td><span>3</span></td>
                    <td>新浪</td>
                    <td>1240253万</td>
                    <td>12%</td>
                  </tr>
                  <tr>
                    <td><span>4</span></td>
                    <td>网易</td>
                    <td>1.2亿</td>
                    <td>39%</td>
                  </tr>
                  <tr>
                    <td><span>5</span></td>
                    <td>雅虎</td>
                    <td>13423万</td>
                    <td>9%</td>
                  </tr>

                </tbody>
              </table>
            </div>

          </div>

          <div class="boxall" style="height:320px">
            <div class="alltitle">标题样式</div>
            <div class="navboxall" id="echart2"></div>
          </div>

          <div class="boxall" style="height:344px">
            <div class="alltitle">标题样式</div>
            <div class="navboxall" id="echart7"></div>
          </div>
        </li>
      </ul>

    </div>
  </div>

  <script>

    $(function () {
      $('.wrap,.adduser').liMarquee({
        direction: 'up',//身上滚动 
        runshort: false,//内容不足时不滚动
        scrollamount: 20//速度
      });
    });

  </script>

</body>

</html>